<template>
	<el-container>
		<el-header style="font-size: 16px;font-weight: 600">系统参数设置</el-header>
		<el-main class="nopadding">
			<el-main>
				<el-form>
					<el-row :gutter="24">
						<el-col :lg="12">
							<el-form-item label="密码长度" label-width="150px">
								<el-input-number v-model="form.passWordLength" placeholder="密码长度"></el-input-number>
							</el-form-item>
						</el-col>
						<el-col :lg="12">
							<el-form-item>
								<span style="color: red;">密码长度不能大于{{ form.passWordLength }}位！</span>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row :gutter="24">
						<el-col :lg="12">
							<el-form-item label="密码强度" label-width="150px">
								<el-switch v-model="form.passWordStrength" :active-value="1" :inactive-value="0"></el-switch>
							</el-form-item>
						</el-col>
						<el-col :lg="12">
							<el-form-item>
								<span style="color: red;">为了账户的安全系统可以设置密码组合方式！</span>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row :gutter="24">
						<el-col :lg="6">
							<el-form-item label="定期修改密码" label-width="150px">
								<el-switch v-model="form.regularlyFlag" active-value="1" inactive-value="0"></el-switch>
							</el-form-item>
						</el-col>
						<el-col :lg="6">
							<el-form-item label="修改周期" v-if="form.regularlyFlag=='1'">
								<el-select v-model="form.cycle">
									<el-option
										v-for="item in options"
										:key="item.value"
										:label="item.label"
										:value="item.value">
									</el-option>
								</el-select>
							</el-form-item>
						</el-col>
						<el-col :lg="12">
							<el-form-item>
								<span style="color: red;">到期后用户登陆时提示用户修改密码。！</span>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row :gutter="24">
						<el-col :lg="12">
							<el-form-item label="首次登陆修改密码" label-width="150px">
								<el-switch v-model="form.initPw" active-value="1" inactive-value="0"></el-switch>
							</el-form-item>
						</el-col>
						<el-col :lg="12">
							<el-form-item>
								<span style="color: red;">账户第一次登陆系统时，提示用户修改密码后再登陆</span>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row :gutter="24">
						<el-col :lg="12">
							<el-form-item label="系统eMail账户" label-width="150px">
								<el-input v-model="form.email" placeholder="系统eMail账户"></el-input>
							</el-form-item>
						</el-col>
						<el-col :lg="12">
							<el-form-item>
								<span style="color: red;">用于系统对外放发送Web邮件。</span>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row :gutter="24">
						<el-col :lg="12">
							<el-form-item label="SMTP服务器" label-width="150px">
								<el-input v-model="form.smtp" placeholder="SMTP服务器"></el-input>
							</el-form-item>
						</el-col>
						<el-col :lg="12">
							<el-form-item>
								<span style="color: red;">想了解SMTP服务的地址信息请与邮件服务器提供商联系。</span>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row :gutter="24">
						<el-col :lg="12">
							<el-form-item label="POP3服务器" label-width="150px">
								<el-input v-model="form.pop3" placeholder="POP3服务器"></el-input>
							</el-form-item>
						</el-col>
						<el-col :lg="12">
							<el-form-item>
								<span style="color: red;">想了解POP3服务的地址信息请与邮件服务器提供商联系。</span>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row :gutter="24">
						<el-col :lg="12">
							<el-form-item label="邮件端口" label-width="150px">
								<el-input-number v-model="form.port" placeholder="邮件端口" :min="1"></el-input-number>
							</el-form-item>
						</el-col>
						<el-col :lg="12">
							<el-form-item>
								<span style="color: red;">想了解端口服务的地址信息请与邮件服务器提供商联系，一般是25、456等。</span>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row :gutter="24">
						<el-col :lg="12">
							<el-form-item label="邮件密码" label-width="150px">
								<el-input v-model="form.passWord" placeholder="邮件密码"></el-input>
							</el-form-item>
						</el-col>
						<el-col :lg="12">
							<el-form-item>
								<span style="color: red;">邮件密码为电子邮件的登陆密码，也有可能为邮件运营商为POP3服务单独供提的密码，请咨询相关人员。</span>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row :gutter="24">
						<el-col :lg="12">
							<el-form-item label="是否启用三员管理" label-width="150px">
								<el-switch v-model="form.securityFlag" active-value="1" inactive-value="0"></el-switch>
							</el-form-item>
						</el-col>
						<el-col :lg="12">
							<el-form-item>
								<span style="color: red;">请先设置三员管理权限后再启用。</span>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row :gutter="24">
						<el-col :lg="12">
							<el-form-item label="是否开启账号多开" label-width="150px">
								<el-switch v-model="form.ydLogin" active-value="1" inactive-value="0"></el-switch>
							</el-form-item>
						</el-col>
						<el-col :lg="12">
							<el-form-item>
								<span style="color: red;">同一个账号是否可以多地登陆。</span>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row :gutter="24">
						<el-col :lg="6">
							<el-form-item label="水印规则" label-width="150px">
								<el-switch v-model="form.waterMark" active-value="1" inactive-value="0"></el-switch>
							</el-form-item>
						</el-col>
						<el-col :lg="6">
							<el-form-item v-if="form.waterMark==='1'">
								<el-input v-model="form.waterMarkRule" placeholder="规则标识"></el-input>
							</el-form-item>
						</el-col>
						<el-col :lg="12">
							<el-form-item>
								<span style="color: red;">[U]:当前用户名[D]:部门[T]:时间[O]:单位名称</span>
							</el-form-item>
						</el-col>
					</el-row>
				</el-form>
			</el-main>
		</el-main>
		<el-footer class="footer">
			<el-button type="primary" @click="setSysConfig">设置</el-button>
		</el-footer>
	</el-container>
</template>

<script>
export default {
	name: 'config',
	data() {
		return {
			form: {
				passWordLength: 8,
				passWordStrength: '0',
				regularlyFlag: '0',
				cycle: '1',
				initPw: '0',
				email: '',
				smtp: '',
				pop3: '',
				port: 456,
				passWord: '',
				securityFlag: '0',
				ydLogin: '0',
				waterMark: '0',
				waterMarkRule: '',
			},
			options: [{
				value: 1,
				label: '一个月'
			}, {
				value: 2,
				label: '二个月'
			}, {
				value: 3,
				label: '三个月'
			}, {
				value: 4,
				label: '四个月'
			}, {
				value: 5,
				label: '五个月'
			}, {
				value: 6,
				label: '半年'
			}, {
				value: 12,
				label: '一年'
			}],
		}
	},
	mounted() {
		this.getSysConfigInfo();
	},
	methods: {
		async setSysConfig() {
			var res = await this.$API.system.sysConfigInit.update.post(this.form);
			if (res.code == 200) {
				this.$message.success(res.message)
			} else {
				this.$alert(res.message, "提示", {type: 'error'})
			}
		},
		async getSysConfigInfo() {
			var res = await this.$API.system.sysConfigInit.getSysConfigInfo.get();
			if (res.code == 200) {
				this.form = res.data;
			} else {
				this.$alert(res.message, "提示", {type: 'error'})
			}
		}
	}
}
</script>

<style scoped>
.footer {
	text-align: center;
}
</style>
